<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>表信息</title>
    <link rel="stylesheet" href="/bus/js/css/layui.css" media="all">
    <link rel="stylesheet" href="/bus/upDataMain/style.css?t=1617720346170" media="all">
    <style>
        body {
            margin: 10px;
        }

        .my-inline3 {
            width: 150px
        }
    </style>
</head>
<body>


<forms class="layui-form">
    <div class="searchTable">
        搜索：
        <div class="layui-inline my-inline3">
            <input class="layui-input" name="keyWord" id="keyWord" placeholder="keyWord" autocomplete="off">
        </div>
        <button class="layui-btn searchBtn" lay-filter="searchBtn" id="searchBtn">搜索</button>
    </div>
</forms>


<table class="" id="tlist" lay-filter="tlist"></table>


<script type="text/html" id="colBar">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="delete">删除</a>
</script>


<script src="/bus/js/layui.js"></script>
<script src="/bus/common.js"></script>
<script src="/bus/template.js"></script>
<script>

    function templateList() {
        var datax = {
            "keyWord": $("#keyWord").val()
        }
        var urlx = "/group/list";
        var func = function (data) {
            table.reload('tlist', {
                // toolbar: '#tlist' //开启头部工具栏，并为其绑定左侧模板
                data: data.data
            });
        }
        commonUtil.sendRequest("POST", datax, urlx, func);
    }

    templateList();

    $("#searchBtn").click(function () {
        templateList();
    });


    //监听行工具事件
    table.on('tool(tlist)', function (obj) { //注
        var data = obj.data //获得当前行数据
            , layEvent = obj.event; //获得 lay-event 对应的值
        if (layEvent === 'detail') {
            layer.msg("detail" + data.id);
            var datax = {"id": data.id};
           // commonUtil.sendRequest("POST", datax, "/template/list");
            commonUtil.openNewWindow(rooturl+"/admin/template/"+data.id);

        } else if (layEvent === 'delete') {
            layer.confirm('真的删除行么', function (index) {
                var func = function (data) {
                    if (data.code == "0") {
                        obj.del(); //删除对应行（tr）的DOM结构
                        layer.close(index);
                    }
                }
                commonUtil.sendRequest("DELETE", "", "/group/" + data.id, func);
            });
        }
    });

    //监听单元格编辑
    table.on('edit(tlist)', function (obj) {
        var value = obj.value //得到修改后的值
            , data = obj.data //得到所在行所有键值
            , field = obj.field; //得到字段
        var datax = "{\"id\":" + data.id + ",\"" + field + "\"" + ":\"" + util.escape(value) + "\"}";
        datax = JSON.parse(datax);
        commonUtil.sendRequest("PUT", datax, "/group/update/");
    });


    //监听头工具栏事件
    table.on('toolbar(tlist)', function (obj) {
        var checkStatus = table.checkStatus(obj.config.id)
            , data = checkStatus.data; //获取选中的数据
        switch (obj.event) {
            case 'add':
                layer.prompt({title: '新增的组名', formType: 2}, function (pass, index) {
                    var datax = {"groupName": pass}
                    var func = function (data) {
                        if (data.code != "0") {
                            console.log("data: " + JSON.stringify(data));
                            layer.msg("操作失败" + JSON.stringify(data));
                            return;
                        } else if (data.code == "0") {
                            console.log("data: " + JSON.stringify(data));
                            layer.msg("操作成功");
                        }
                        layer.close(index);
                        templateList();
                    }
                    commonUtil.sendRequest("POST", datax, "/group/add",func);
                });
                break;
            case 'update':
                if (data.length === 0) {
                } else if (data.length > 1) {
                } else {
                }
                break;
            case 'delete':
                if (data.length === 0) {
                } else {
                }
                break;
        }
    });

</script>
</body>
</html>
